<template>
  <a-modal
    title="编辑团队"
    v-model="$parent.showModel"
    @ok="save"
    @cancel="cancel"
    okText="保存"
    cancelText="取消"
  >
    <a-form :form="form">
      <a-form-item
        :label-col="formItemLayout.labelCol"
        :wrapper-col="formItemLayout.wrapperCol"
        label="团队名称"
      >
        <a-input
          v-decorator="[
          'department_name',
          {rules: [{ required: true, message: '请输入团队名称' }]}
        ]"
          placeholder="请输入团队名称"
        />
      </a-form-item>
      <a-form-item
        :label-col="formItemLayout.labelCol"
        :wrapper-col="formItemLayout.wrapperCol"
        label="团队类型"
      >
        <a-radio-group 
          v-decorator="[
          'department_type',
          {rules: [{required: true, message: '请输入团队类型' }],initialValue:'实际团队'}
        ]">
          <a-radio value="实际团队">实际团队</a-radio>
          <a-radio value="虚拟团队">虚拟团队</a-radio>
        </a-radio-group>
      </a-form-item>
      <a-form-item
        :label-col="formItemLayout.labelCol"
        :wrapper-col="formItemLayout.wrapperCol"
        label="团队负责人"
      >
        <a-select
          v-decorator="[
          'manager_employee_id',
          {rules: [{ required: false, message: '请检索团队负责人' }]}
        ]"
          mode="multiple"
          labelInValue
          placeholder="请检索团队负责人"
          style="width: 100%"
          :filterOption="false"
        >
          <a-spin slot="notFoundContent" size="small" />
          <a-select-option v-for="d in employees" :key="d.value">{{d.text}}</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item
        :label-col="formItemLayout.labelCol"
        :wrapper-col="formItemLayout.wrapperCol"
        label="团队排序"
      >
        <a-input-number
          style="width:100%"
          v-decorator="[
          'order_num',
          {rules: [{required: true, message: '请输入团队排序' }]}
        ]"
          placeholder="请输入团队排序"
        />
      </a-form-item>
      <a-form-item
        :label-col="formItemLayout.labelCol"
        :wrapper-col="formItemLayout.wrapperCol"
        label="团队描述"
      >
        <a-textarea
          v-decorator="[
          'department_content',
          {rules: [{required: false }],initialValue:'aaaa'}
        ]"
          placeholder="请输入团队描述"
          :autosize="{ minRows: 2, maxRows: 6 }"
        />
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script>
const formItemLayout = {
  labelCol: { span: 6 },
  wrapperCol: { span: 16 }
};
export default {
  data() {
    return {
      formItemLayout,
      form: this.$form.createForm(this),
      employees: []
    };
  },
  created() {},
  mounted() {
  },
  methods: {
    save() {
      this.form.validateFields(async (err, values) => {
        if (err) return;
        let level_num = this.$parent.curLevel;
        values.parent_id = "00000000-0000-0000-0000-000000000000";
        let departments = this.$parent.departments;
        if (level_num > 0) {
          let parent = departments[level_num - 1].find(v => v.selected == true);
          if (parent) values.parent_id = parent.id;
        }
        let result = await this.$post("/employee/department/save", values);
        if (result.error) return;
        this.$notification.success({
          message: "保存成功"
        });
        this.form.resetFields();
        this.$parent.showModel = false;
        let insertIndex = 0;
        let delNum = 0;
        if (values.id) {
          insertIndex = departments[level_num].findIndex(
            v => v.id == values.id
          );
          result.data.selected = true;
          delNum = 1;
        } else {
          insertIndex = departments[level_num].findIndex(
            v => v.order_num > result.data.order_num
          );
          if (insertIndex < 0) insertIndex = departments[level_num].length;
        }
        departments[level_num].splice(insertIndex, delNum, result.data);
      });
    },
    cancel() {
      this.form.resetFields();
      this.$parent.showModel = false;
    }
  }
};
</script>
